import 'package:flutter/material.dart';

class WColumn extends StatefulWidget {
  @override
  _WColumnState createState() => _WColumnState();
}

class _WColumnState extends State<WColumn> {
  Widget _ColumnItem(String content) {
    return Container(
      padding: EdgeInsets.all(5),
      child: Text(
        content,
        style: TextStyle(fontWeight: FontWeight.w300, fontSize: 20),
      ),
      decoration: BoxDecoration(
          border: Border.all(color: Colors.black, width: 1),
          borderRadius: BorderRadius.circular(3)),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Cloumn"),
        centerTitle: true,
      ),
      body: ListView(
        children: <Widget>[
          SizedBox(
            height: 10,
          ),
          Container(
            width: double.infinity,
            height: 200,
            color: Colors.cyan,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                _ColumnItem("column 1"),
                _ColumnItem("column 2"),
                _ColumnItem("column 3"),
              ],
            ),
          ),
          SizedBox(
            height: 10,
          ),
          Container(
            width: double.infinity,
            height: 200,
            color: Colors.purple,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                _ColumnItem("column 1"),
                _ColumnItem("column 2"),
                _ColumnItem("column 3"),
              ],
            ),
          ),
          SizedBox(
            height: 10,
          ),
          Container(
            width: double.infinity,
            height: 200,
            color: Colors.amberAccent,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.end,
              children: <Widget>[
                _ColumnItem("column 1"),
                _ColumnItem("column 2"),
                _ColumnItem("column 3"),
              ],
            ),
          ),
          SizedBox(
            height: 10,
          ),
          Container(
            width: double.infinity,
            height: 200,
            color: Colors.indigoAccent,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: <Widget>[
                _ColumnItem("column 1"),
                _ColumnItem("column 2"),
                _ColumnItem("column 3"),
              ],
            ),
          ),
        ],
      ),
    );
  }
}
